<script setup>
import {useProgressStore} from "../../stores/progressStore.js";
import request5151 from "../../utils/request5151.js";
import {ElMessage} from "element-plus";
import {useRouter} from "vue-router";
import {ArrowLeftBold, Coin, Edit, Goods, Message, Place, Right, School} from "@element-plus/icons-vue";

const router = useRouter()
const progressStore = useProgressStore()
console.log(progressStore.getProgress())
// 获取进度
const getMyProgress = () => {
  request5151({
    url: '/welcomeProgress/getProgressBySNumber',
    method: 'get',
    params: {
      sNumber: sessionStorage.getItem('snumber')
    }
  }).then(res => {
    if (res.data.code === 200) {
      //存入pinia
      const data = res.data.data
      progressStore.setProgressM(data.registered)
      progressStore.setProgressR(data.roomed)
      progressStore.setProgressP(data.payed)
      progressStore.setProgressG(data.geted)
    }
  }).catch(err => {
    ElMessage.error(err.message)
  })
}
getMyProgress()
</script>

<template>
  <div class="reportAll">
    <div class="reportAll_top">
      <el-icon @click="router.push('/welcome')" size="40" style="margin-left: 20px;"><ArrowLeftBold /></el-icon>
    </div>
    <div class="reportAll_content">
      <div class="reportItem">
        <el-button type="success" size="large" round :icon="Edit"
                   @click="router.push('/reportAll/filedReport')" el-button>现场报到</el-button>
        <el-icon><Right /></el-icon>
        <el-button type="success" size="large" round :icon="Message"
                   @click="router.push('/reportAll/messageCollect')">信息采集</el-button>
        <el-icon><Right /></el-icon>
        <el-button type="success" size="large" :disabled="progressStore.getProgress().messageCollected===0"
                   @click="router.push('/reportAll/roomSelect')" round :icon="School">宿舍选择</el-button>
        <el-icon><Right /></el-icon>
        <el-button type="success" size="large" :disabled="progressStore.getProgress().roomSelected===0"
                   @click="router.push('/reportAll/goodsGet')" round :icon="Goods">自愿领取物品</el-button>
        <el-icon><Right /></el-icon>
        <el-button type="success" size="large" :disabled="progressStore.getProgress().goodsGeted===0"
                   @click="router.push('/reportAll/toPay')" round :icon="Coin">缴纳费用</el-button>
        <el-button type="primary" size="large"
                   @click="router.push('/endW/schoolRoom')" round :icon="Place">位置引导</el-button>
      </div>
      <div class="reportAll_main">
        <router-view/>
      </div>
    </div>

  </div>
</template>

<style scoped>
.reportItem {
  align-items: center;
  justify-content: space-between;
  display: flex;
  width: 90%;
  height: 100px;
  margin: 0 auto;
  background-color: rgb(244, 244, 244);
}

.reportAll_main {
  width: 100%;
  height: 710px;
  border: 1px solid #91d5ff;
}
.reportAll{
  background-color: rgb(244, 244, 244);
}
.reportAll_top {
  width: 100%;
  height: 40px;
  background-color: #13ce66;
  cursor: pointer;
}
</style>
